<template>
	<view>
		<!-- <view>推荐岗位</view> -->
		<view class="form-item cu-form-group search-box">
			<view class="title">企业选择</view>
			<picker @change="companyChange" :value="index" :range="company" range-key="name">
				<view class="picker">
					{{index > 0 ? company[index].name : '请选择'}}
				</view>
			</picker>
		</view>

		<view class="scroll-v list" v-if="list.length > 0">
			<view v-for="(items,index) in list" :key="index">
				<view class="recommend-bigbox">
					<view class="flex box">
						<view class="box-title1">{{items.name}}</view>
						<view class="box-title2" v-if="items.recruit_type_msg!=null">{{items.recruit_type_msg}}</view>
						<view class="box-title3">距离招聘结束还有{{items.end_date_num}}天</view>
					</view>
					<view class="todo">{{items.company_name_}}</view>
					<view class="flex">
						<view class="list-box">{{items.edu_name_str}}</view>
						<view class="list-box">{{items.sex_desc}}</view>
						<view class="list-box">{{items.age_lower}} - {{items.age_upper}}岁</view>
					</view>
					<view class="flex date-bigbox">
						<!-- <view class="date flex">
							<view>发布日期:</view>
							<view class="content" v-if="items.start_date!=null">{{items.start_date}}</view>
						</view> -->
						<view class="date flex">
							<view>结束日期:</view>
							<view class="content" v-if="items.end_date!=null">{{items.end_date}}</view>
						</view>
						<view class="date flex">
							<view>发布人:</view>
							<view class="content">{{items.recruit_team_name || items.tenant_name}}</view>
						</view>
					</view>
				</view>
				<view class="flex btm-box">
					<view class="flex">
						<view>招聘情况:</view>
						<view>{{items.working}}</view>
						<view>/{{items.person_num}}</view>
					</view>
					<view class="flex img-bigbox" @tap="handleClickWeixin(items)">
						<img class="img-box" src="../../static/icon/icon_wechat.png" alt="">
						<view class="send">发微信</view>
					</view>
					<view class="flex last-bigbox">
						<img class="last-img" src="../../static/icon/icon_recommend.png" alt="">
						<view class="last-title" @tap="handleClickApply(items)">一键报名</view>
					</view>
				</view>
			</view>
			<view class="loadStatus">{{loadStatus}}</view>
		</view>
		<loading v-else-if="firstload"></loading>
		<!-- 无内容默认 -->
		<no-thing v-else></no-thing>
		<view class="cu-modal show" v-if="showConfirm">
		    <view class="cu-dialog dialog-container">
		        <view class="cu-bar dialog-title-view flex rcb">
		            <view class="dialog-title-style">温馨提示</view>
		            <view class="dialog-btn-close" @tap="onPressCancel">
		                <text class="cuIcon-close"></text>
		            </view>
		        </view>
		        <view class="dialog-content-view flex ccc">
		            <view class="dialog-context flex ccc">确定要一键报名吗？</view>
		        </view>
		        <view class="cu-bar dialog-btn-wrap flex rcb">
		            <view class="btn-item btn-cancel-item flex ccc" @tap="onPressCancel">取消</view>
		            <view class="btn-item btn-submit-item flex ccc" @tap="onPressSubmit">确定</view>
		        </view>
		    </view>
		</view>
	</view>
</template>

<script>
	import loading from "../../components/common/loading.vue";
	import noThing from "../../components/common/no-thing.vue";
	export default {
		components: {
			loading,
			noThing,
		},
		data() {
			return {
				showConfirm: false,
				firstload: true,
				item: "",
				loadStatus: "",
				list: [],
				company: [],
				index: -1,
				token: '',
				page: 1,
				position_id: '', //岗位id
				search: '', //岗位名称
				team_id: '', //招聘小组id
				company_id: '', //企业id
				personnel_id: '', //人才id
				status: '', //状态，不传值是查询全部，0是关闭 其他的值是开启的
			}
		},
		onLoad(option) {
			this.reqSearchData();
			this.loadStatus = '';
			if (option.item) {
				let list = JSON.parse(option.item)
				// console.log("传过来的",JSON.parse(option.item))
				this.search = list.position_name; //岗位名称
				this.personnel_id = list.id
				this.position_id = list.position_id; //岗位id
				// this.team_id = '',  //招聘小组id
				// this.company_id = '',  //企业id
				// this.status:'',  //状态，不传值是查询全部，0是关闭 其他的值是开启的
			}
			// uni.startPullDownRefresh();
		},
		onPullDownRefresh() {
			this._onRefresh();
			// console.log('refresh');
			setTimeout(function() {
				uni.stopPullDownRefresh();
			}, 1000);
		},
		onReachBottom() {
			// console.log('_onLoadMore---->', '_onLoadMore');
			this.loadMore();
		},
		methods: {
			onPressCancel() {
			    this.showConfirm = false;
			},
			async onPressSubmit() {
			    let url = this.ServicesApi.signUpAction;
			    let data = {
			        position_id: this.item.id, //岗位id
			        personnel_id: this.personnel_id, //人才id
			        company_id: this.item.company_id, //企业id
			    };
			    let result = await this.Services.post(url, data);
			    if (result.code == this.StatusCode.SUCCESS_CODE) {
			        uni.showToast({
			            icon: 'none',
						title: result.msg,
			        });
			        this.showConfirm = false;
			        this._onRefresh();
			    } else {
			        uni.showToast({
			            icon: 'none',
			            title: result.msg,
			        });
			    }
			},
			// 下拉刷新
			_onRefresh() {
				this.page = 1;
				this.reqListData();
				// console.log('_onRefresh---->', '_onRefresh');
			},
			// 取token
			getToken() {
				try {
					const value = uni.getStorageSync('login_key');
					if (value) {
						this.token = value;
					}
				} catch (e) {
					// error
				}
			},
			async reqSearchData() {
				this.getToken();
				// 发请求
				let url = this.ServicesApi.selectWhereList;
				let data = {
					// id,
				};
				let result = await this.Services.post(url, data);
				if (result.code == this.StatusCode.SUCCESS_CODE) {
					this.company = result.data.company_list;
				}
			},
			// 上拉加载
			async loadMore() {
				this.loadStatus = "加载中..."
				this.page++;
				// console.log(this.page)
				this.getToken();
				// 发请求
				let url = this.ServicesApi.recommend;
				let data = {
					page: this.page,
					limit: 10,
					search: this.search, //岗位名称
					team_id: '', //招聘小组id
					company_id: this.company_id, //企业id
					personnel_id: this.personnel_id, //人才id
					status: '', //状态，不传值是查询全部，0是关闭 其他的值是开启的
				};
				let result = await this.Services.post(url, data);
				if (result.code == this.StatusCode.SUCCESS_CODE) {
					let arr = result.data.data;
					this.list.push(...arr)
					if (arr.length < 10) {
						this.loadStatus = "没有更多数据"
					}
				} else {
					this.loadStatus = "没有更多数据"
				}
			},
			// 请求列表数据
			async reqListData() {
				this.getToken();
				// 发请求
				let url = this.ServicesApi.recommend;
				let data = {
					page: this.page,
					limit: 10,
					search: this.search, //岗位名称
					team_id: '', //招聘小组id
					company_id: this.company_id, //企业id
					personnel_id: this.personnel_id, //人才id
					status: '', //状态，不传值是查询全部，0是关闭 其他的值是开启的
				};
				let result = await this.Services.post(url, data);
				if (result.code == this.StatusCode.SUCCESS_CODE) {
					this.list = result.data.data;
					this.firstload = false;
				} else {
					this.firstload = false;
				}
			},
			// 点击发微信
			async handleClickWeixin(item, type) {
				let url = type > 1 ? this.ServicesApi.send_Email : this.ServicesApi.send_WeChat;
				let data = {
					position_id: item.id,
					personnel_id: this.personnel_id,
				};
				let result = await this.Services.post(url, data);
				uni.showToast({
					icon: 'none',
					title: result.msg,
				});
			},
			// 点击一键报名
			handleClickApply(items) {
				this.item = items;
				this.showConfirm = true;
				return;
				this.getToken();
				uni.showModal({
					title: '温馨提示',
					content: '确认要一键报名吗？',
					showCancel: true,
					cancelText: '取消',
					confirmText: '确认',
					success: async res => {
						if (res.confirm) {
							let url = this.ServicesApi.signUpAction;
							let data = {
								position_id: items.id, //岗位id
								personnel_id: this.personnel_id, //人才id
								company_id: items.company_id, //企业id
							};
							let result = await this.Services.post(url, data);
							if (result.code == this.StatusCode.SUCCESS_CODE) {
								uni.showToast({
									icon: 'none',
									title: result.msg,
								});
								this.reqListData();
							} else {
								uni.showToast({
									icon: 'none',
									title: result.msg,
								});
							}
						} else if (res.cancel) {
							// uni.showToast({
							// 	title: '取消'
							// });
						}
					}
				});

			},
			companyChange(e) {
				uni.hideKeyboard();
				this.index = e.detail.value;
				this.company_id = this.company[this.index].id;
				this.reqListData();
			},
		},
		mounted() {
			// this.reqSearchData();
			this.reqListData();
		}
	}
</script>

<style scoped lang="stylus">
	.loadStatus {
		height: 60upx;
		text-align: center;
		color: #ccc;
		font-size: 30upx;
		// background:pink;
		margin-top: -30upx;
		line-height: 60upx;
		margin-bottom: 20upx;
	}

	.scroll-v {
		height: 100vh;
	}

	.search-box {
		margin-bottom: 20upx;
	}

	.recommend-bigbox {
		padding: 34upx 40upx;
		background: #fff;

		.box {
			justify-content: space-between;
			align-items: center;

			.box-title1 {
				font-size: 36upx;
				color: #333333;
			}

			.box-title2 {
				font-size: 28upx;
				color: #999999;
				// margin-right:200upx;
			}

			.box-title3 {
				font-size: 28upx;
				color: #999999;
			}
		}

		.todo {
			font-size: 28upx;
			color: #666;
			margin: 22upx 0;
		}

		.list-box {
			font-size: 26upx;
			color: #999;
			background: #F3F3F3;
			padding: 8upx 12upx;
			margin-right: 20upx;
		}

		.date-bigbox {
			margin: 30upx 0;
			justify-content: space-between;

			.date {
				font-size: 28upx;
				color: #999;

				.content {
					color: #666;
					margin-left: 10upx;
				}
			}
		}
	}

	.btm-box {
		height: 88upx;
		border-top: 1upx solid #DBDBDB;
		background: #fff;
		padding: 0 40upx;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 50upx;

		.img-bigbox {
			align-items: center;
			margin-left: 100upx;

			.img-box {
				height: 26upx;
				width: 30upx;
				margin-right: 6upx;
			}
		}

		.last-bigbox {
			height: 54upx;
			width: 200upx;
			background: linear-gradient(90deg, rgba(74, 144, 226, 1) 0%, rgba(0, 102, 220, 1) 100%);
			align-items: center;
			font-size: 28upx;
			color: #fff;

			.last-img {
				height: 36upx;
				width: 28upx;
				margin: 0 10upx 0 18upx;
			}
		}
	}
</style>
